<template>
    <div id="home">
        <kheader></kheader>

        <div class="total">


            <maincat></maincat>

            <scroll class="mainview" ref="scroll">
                <router-view></router-view>
            </scroll>


        </div>
    </div>
</template>

<script>
    import Scroll from "../components/common/scroll/scroll";
    import kheader from "../components/content/kheader";
    import Maincat from "../components/content/maincat";

    export default {
        name: "Home",
        components:{
            Scroll,
            kheader,
            Maincat
        },
        created() {
            if (this.$store.state.user == '') {
                this.$router.replace('/login')
            }
        },
        watch:{
            '$route.path':function() {
                this.appkey = new Date().getTime()
                this.$refs.scroll.backtotop(0,0,100)
                this.$refs.scroll.refresh()
            }
        }
    }
</script>

<style scoped>
    #home{
        height: 100%;
    }
    .total{
        display: flex;
        top:10%;
        height:92%;
    }
    .el-button{
        padding:0 0 0 0 !important;
    }

    .mainview{
        float:left;
        position: relative;
        height:100%;
        box-shadow:0 2px 4px rgba(0,0,0,.12),0 0 6px rgba(0,0,0,.04);
        background-color: #E9EEF3;
        color:#333;
        border-radius: 4px;
        border-color: #545c64;
        width: 100%;
        overflow:hidden;
    }



</style>